import { Store, createStore } from "vuex";
import { InjectionKey } from "vue";
import todos from "./modules/todos";
import { TodoInit } from "./modules/todos";
export type State = {
  count: number;
  todos?: TodoInit;
  routes: [];
  user: string;
  tags: Array<{}>;
  style: {
    "--theme-color": string;
    "--theme-bg": string;
    minHeight: string;
  };
};

export const key: InjectionKey<Store<State>> = Symbol();

export default createStore({
  state: {
    count: 0,
    routes: [],
    user: "",
    tags: [
      {
        path: "/entry/index",
        name: "entry_index",
        meta: {
          icon: "user",
          title: "工作台",
          cache: false,
        },
      },
    ],
    style: {
      "--theme-color": "black",
      "--theme-bg": "white",
      // "--dark-color": "white",
      // "--dark-bg": "black",
      minHeight: "100vh",
    },
  },
  mutations: {
    add(state) {
      state.count;
    },
    SET_ROUTES: (state, data) => {
      state.routes = JSON.parse(sessionStorage.getItem("routes") as string);
    },
    set_user(state, data) {
      state.user = data;
    },
    SET_TAGS: (state, data) => {
      state.tags.push(data);
    },
    fresh_tags: (state, data) => {
      state.tags = data;
    },
    SET_STYLE_THEME: (state, data) => {
      state.style["--theme-color"] = data["--theme-color"];
      state.style["--theme-bg"] = data["--theme-bg"];
    },
  },
  modules: {
    todos,
  },
});
